<include file="Public/header" />
<include file="Public/menu" />
<link rel="stylesheet" href="/Public/admin/adminlte/bootstrap/css/bootstrap-switch.min.css">
<!-- 内容页 -->
<div class="content-wrapper">
    <!-- 面包屑 -->
    <section class="content-header">
        <h1>
            首页管理
            <small>热门搜索</small>
        </h1>
        <ol class="breadcrumb">
            <li><a href="{:U(index)}"><i class="fa fa-dashboard"></i> 热门搜索</a></li>
            <li class="active">关键字编辑</li>
        </ol>
    </section>

    <!-- 内容 -->
    <section class="content"><div class="row"><div class="col-md-12">
        <div class="box box-info">
            <div class="box-header with-border">
                <h3 class="box-title">关键字编辑</h3>

                <div class="box-tools">

                    <div class="btn-group pull-right" style="margin-right: 10px">
                        <a href="{:U('index')}" class="btn btn-sm btn-default"><i class="fa fa-list"></i>&nbsp;关键字列表</a>
                    </div>
                </div>
            </div>
            <!-- /.box-header -->
            <!-- form start -->
            <form action="{:U('edit')}" method="post" accept-charset="UTF-8" class="form-horizontal" pjax-container="">
                <div class="box-body">
                    <div class="form-group">
                        <label class="col-sm-2 control-label">标签名称</label>
                        <div class="col-sm-6">
                            <div class="input-group">
                                <span class="input-group-addon"><i class="fa fa-pencil"></i></span>
                                <input type="text" name="name" value="{$info['name']}" class="form-control" placeholder="关键字名称">
                                <input type="hidden" name="id" value="{$info['id']}">
                            </div>
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-sm-2 control-label">开关</label>
                        <div class="col-sm-6">
                            <div class="input-group">
                                <div class="switch">
                                    <input type="checkbox" name="state"  data-on-text="开" data-off-text="关" <if condition="$info['state'] eq 1 or $info['state'] eq ''">checked</if>>
                                </div>
                            </div>
                        </div>
                    </div>

                    <div class="form-group">
                        <label class="col-sm-2 control-label">关键字</label>
                        <div class="col-sm-6">
                            <div class="input-group">
                                <span class="input-group-addon"><i class="fa fa-pencil"></i></span>
                                <input type="text" name="keywords[]" value="{$info['keywords'][0]}" class="form-control" placeholder="输入关键字">
                                <span class="input-group-addon addkey"><i class="fa fa-fw fa-plus"></i></span>
                            </div>
                        </div>
                    </div>
                    <if condition="$info['num'] gt 1">
                        <volist name="info['keywords']" id="vo" offset="1">
                            <div class="form-group">
                                <label class="col-sm-2 control-label"></label>
                                <div class="col-sm-6">
                                    <div class="input-group">
                                        <span class="input-group-addon"><i class="fa fa-pencil"></i></span>
                                        <input type="text" name="keywords[]" value="{$vo}" class="form-control" placeholder="输入关键字">
                                        <span class="input-group-addon delkey"><i class="fa fa-fw fa-minus"></i></span>
                                    </div>
                                </div>
                            </div>
                        </volist>
                    </if>
                </div>
                <!-- /.box-body -->
                <div class="box-footer">
                    <div class="col-sm-2">

                    </div>
                    <div class="col-sm-6">

                        <div class="btn-group pull-left">
                            <button type="submit" class="btn btn-info pull-right">提交</button>
                        </div>
                    </div>

                </div>
                <!-- /.box-footer -->
            </form>
        </div>

    </div></div>

    </section>
</div>
<!-- 底部 -->
<include file="Public/common_footer" />
<script src="__PUBLIC__/admin/adminlte/bootstrap/js/bootstrap-switch.min.js"></script>
<script>
    $(function(argument) {
        $('[type="checkbox"]').bootstrapSwitch();
    })

    $('.box-body').on('click', '.addkey', function () {
        var html = '';
        html += '<div class="form-group"><label class="col-sm-2 control-label"></label><div class="col-sm-6"><div class="input-group"><span class="input-group-addon"><i class="fa fa-pencil"></i></span>';
        html += '<input type="text" name="keywords[]" value="" class="form-control" placeholder="输入关键字">';
        html += '<span class="input-group-addon delkey"><i class="fa fa-fw fa-minus"></i></span></div></div></div>';
        $('.box-body').append(html);
    });

    $('.box-body').on('click', '.delkey', function () {
        $(this).parent().parent().parent('.form-group').remove();
    })

    $('.form-horizontal').validate({
        rules: {
            name: {
                required: true,
                rangelength :[1,50]
            },
            'keywords[]': {
                required: true,
                rangelength :[1,50]
            }
        },
        messages: {
            name: {
                required: '标签名称必填',
            },
            'keywords[]': {
                required: '关键字必填',
            }
        }
    })
</script>
